@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Light'), local('OpenSans-Light'), url(../font/open-sans-light.woff) format('woff');
}
body {
  color: #9ea7b3 !important;
  font-family: "Open Sans", Arial, sans-serif !important;
  font-size: 13px !important;
  line-height: 20px;
  overflow-x: hidden !important;
  min-height: 100%;
  z-index: -2;
  margin: 0 !important;
  background: url('../img/bg.jpg') no-repeat top center fixed;
  -moz-background-size: cover;
  -webkit-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
/*common*/
.main-content {
  display: flex;
}
.main-left {
  width: 250px;
  color: #fff;
  font-family: "Open Sans";
  position: relative;
  padding: 0 10px;
}
.main-left .title-box {
  height: 60px;
  line-height: 60px;
  padding: 0 8px;
}
.main-left .title-box h1 span {
  background: rgba(0, 0, 0, 0.15);
  font-size: 13px;
  padding: 0 4px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.main-left .title-box .toggle-icon {
  position: absolute;
  top: 10px;
  right: 20px;
  width: 28px;
  height: 30px;
  line-height: 30px;
  text-align: center;
  background: rgba(0, 0, 0, 0.2);
  -webkit-border-radius: 3px;
  -moz-border-radius: 3px;
  border-radius: 3px;
}
.main-left .title-box .toggle-icon .iconfont {
  font-size: 12px;
}
.main-left .title-box .toggle-icon:hover {
  background: rgba(0, 0, 0, 0.7);
  cursor: pointer;
}
.main-left .menu-list .menu-item {
  background: rgba(0, 0, 0, 0.12);
  margin-bottom: 10px;
  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
  padding: 10px 8px;
}
.main-left .menu-list .menu-item .title {
  font-family: "Open Sans";
  font-size: 12px;
  background: rgba(0, 0, 0, 0.25);
  padding: 3px 12px;
  -webkit-border-radius: 12px;
  -moz-border-radius: 12px;
  border-radius: 12px;
}
.main-right {
  background: #00F7DE;
}
